<template>
  <a-modal width="70%" v-bind:visible="isShowRecord" title="切换通道记录" @ok="handleOk" @cancel="onCancel">
    <div class="top">
      <span>切换通道范围：</span> <a-range-picker> </a-range-picker
      ><a-button style="margin: 0 10px" type="primary">查询</a-button>
    </div>
    <a-table style="margin: 10px 0; border: 1px solid #e8e8e8" :columns="columns" :data-source="data"> </a-table>
  </a-modal>
</template>

<script>
export default {
  props: {
    isShowRecord: {
      type: Boolean,
      default: false
    }
  },
  name: 'RecordList',
  data() {
    return {
      data: [],
      columns: [
        {
          title: '#',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '计划编号',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '用户姓名',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '用户手机号',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '银行名称',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '原通道名称',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '切换后通道',
          dataIndex: 'name',
          align: 'center'
        },
        {
          title: '切换时间',
          dataIndex: 'name',
          align: 'center'
        }
      ]
    }
  },
  methods: {
    handleOk() {
      this.$emit('update:isShowRecord', false)
    },
    onCancel() {
      this.$emit('update:isShowRecord', false)
    }
  }
}
</script>

<style lang="less" scoped>
.top {
  display: flex;
  align-items: center;
}
</style>
